<template>
	<view class="content mainpadding">
		<view class="text_g margin_top5 textcenter color_ling text">訂單金額</view>
		<view class="price margin_top1">
			<text class="text">$</text>
			<text>{{paymoney}}</text>
		</view>
		<view class="margin_top5 mainpadding ffffff border">
			<view class="flexbetween" style="border-bottom: 1rpx solid rgba(0, 0, 0, .2);padding-bottom: 30rpx;">
				<view class="text_g color_san">支付方式</view>
			</view>
			<view class="flexbetween margin_top "  @click="type=1">
				<view class="flexleft">
					<image class="imgBox margin_right" src="@/static/image/system/payment1.png" mode=""></image>
					<view class="text_a color_san margin_right">點數支付</view>
					<view class="text_a color_san">${{allMoney}}</view>
					
				</view>
				<view class="flexright">
					<view class="chuzhi" style="margin-right: 50rpx;" @click.stop="jumpurl('/pages/my/recharge')">儲值點數
					</view>
					<view :class="type==1?'xuanzhongs':'wiexuanzhongs'"></view>
				</view>
			</view>
			<view class="flexbetween margin_top " v-if="dyList.length"  @click="type=2">
				<view class="flexleft">
					<image class="imgBox margin_right" src="@/static/image/system/payment5.png" mode=""></image>
					<view class="text_a color_san">多元支付</view>
				</view>
				<view :class="type==2?'xuanzhongs':'wiexuanzhongs'"></view>
			</view>
			<template v-if="paytype==3">
				<!-- linepay支付 -->
				<view class="flexbetween margin_top " v-if="payshopInfo.linepay_status==1" @click="type=5">
					<image src="https://useradmin.opos.tw/uploads/20241014/877a9ba7a98f75b90a9d49f53f15a858.webp"
						class="radius" style="width: 40%;" mode="widthFix"></image>
					<view :class="type==5?'xuanzhongs':'wiexuanzhongs'"></view>
				</view>
				<!-- 街口支付 -->
				<view class="flexbetween margin_top " v-if="payshopInfo.jkpay_status==1" @click="type=6">
					<image src="https://useradmin.opos.tw/uploads/20241014/c74d97b01eae257e44aa9d5bade97baf.webp"
						class="radius" style="width: 40%;" mode="widthFix"></image>
					<view :class="type==6?'xuanzhongs':'wiexuanzhongs'"></view>
				</view>
			</template>
		</view>
		<view class="footer flexbetween">
			<view class="submitbtn" @click="payment">
				立即支付
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				type: 1, // 1點數支付，2多元支付
				paymoney: 0,
				paytype: 1, //1購買員工，2打印機支付,3分店調查支付
				allMoney: "",
				id: "",
				shopprinter_id: "", //打印機id
				issubmit: false,
				dyList: [],
				payshop_id: "", //需要支付給對方的商家id,暫時只有分店調查支付有
				payshopInfo:{}
			}
		},
		onLoad(options) {
			this.paymoney = options.paymoney
			this.paytype = options.paytype
			this.id = options.id
			if (options.shop_id) {
				this.payshop_id = options.shop_id
				this.getShopInfo()
			}
			if (options.shopprinter_id) {
				this.shopprinter_id = options.shopprinter_id
			}
			this.dyishave()
		},
		onShow() {
			this.get()
		},
		methods: {
			getShopInfo() {
				this.http.request("/api/shop/Shopdeail	", 'POST', {
					shop_id: this.payshop_id,
				}).then(res => {
					this.payshopInfo = res.data
				})
			},
			dyishave() {
				this.http.request("/api/index/getpaytype", 'POST', {
					shop_id: uni.getStorageSync("shop_id"),
					type: ""
				}).then(res => {
					if (res.code == 1) {
						this.dyList = res.data
					}
				})
			},
			async get() {
				let res = await this.http.request('/api/shop/Shopdeail', 'POST', {
					shop_id: uni.getStorageSync("shop_id"),
				})
				if (res.code == 1) {
					uni.setStorageSync("appkey", res.data.appkey)
					uni.setStorageSync("hy_type", res.data.hy_type)
					uni.setStorageSync("opentable_status", res.data.opentable_status)
					uni.setStorageSync("is_sdkfp", res.data.is_sdkfp)
					uni.setStorageSync("houtel_type", res.data.houtel_type)
					this.allMoney = res.data.countmoney
				} else {
					this.http.toast(res.msg)
				}
			},
			async payment() { //立即支付
				if (this.issubmit) return
				if (this.type == 1) {
					if (Number(this.allMoney) < Number(this.paymoney)) {
						this.http.toast("點數不足")
						return false
					}
				}
				if (this.type == 2) {
					uni.redirectTo({
						url: "/pages/my/duoyuanzf?id=" + this.id + "&paytype=" + this.paytype +
							"&shopprinter_id=" + this.shopprinter_id
					})
					return false
				}
				let data = {
					type: this.type, // 1點數支付，2多元支付
					id: this.id, //購買id
					shop_id: uni.getStorageSync("shop_id"),
				}
				let url = "/api/shop/addbuyuser"
				if (this.paytype == 2) { //打印機支付
					url = "/api/shop/addtmach"
					this.$set(data, "shopprinter_id", this.shopprinter_id)
				}
				if (this.paytype == 3) { //分店調查支付
					url = "/api/Shopwelfarecl/paymentorder"
					data = {
						id: this.id,
						paytype: this.type
					}
				}
				this.issubmit = true
				let res = await this.http.request(url, 'POST', data)
				if (res.code == 1) {
					if (this.type == 5 || this.type == 6) { //linepay || 街口綫上支付
						if (this.type == 5) {
							location.href = res.data.web
							// linePay 回調跳轉頁面/pages/my/linezhifuhj
						}
						if (this.type == 6) {
							location.href = res.data.payment_url
						}
						return false
					}
					this.http.toast("支付成功！")
					if (this.paytype == 3) {
						setTimeout(() => {
							uni.switchTab({
								url: "/pages/workbench/workbench"
							})
						}, 500)
					}
					setTimeout(() => {
						uni.navigateBack(1)
					}, 500)
				} else {
					this.issubmit = false
					this.http.toast(res.msg)
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	.price {
		font-size: 72rpx;
		font-family: DIN-Bold, DIN;
		font-weight: bold;
		color: #000000;
		text-align: center;

		.text {
			font-size: 40rpx;
		}
	}

	.imgBox {
		width: 42rpx;
		height: 42rpx;
	}
	.chuzhi {
		background-color: #f56c6c;
		color: #fff;
		padding: 10rpx 30rpx;
		border-radius: 10rpx;
	}
</style>